<!doctype html>
<html>
<head>
    <meta charset="utf-8">
    <script type="text/javascript" src="./script/rem.js"></script>
    <meta name="viewport" content="maximum-scale=1.0,minimum-scale=1.0,user-scalable=0,width=device-width,initial-scale=1.0"/>
    <meta content="yes" name="apple-mobile-web-app-capable">
    <meta content="yes" name="apple-touch-fullscreen">
    <meta name="format-detection" content="telephone=no,email=no,date=no,address=no">
    <link rel="stylesheet" type="text/css" href="./css/font-awesome.css" />
    <link rel="stylesheet" type="text/css" href="./css/style.css" />
    
    <script type="text/javascript" src="./script/aui-slide.js"></script>
    <script type="text/javascript" src="./script/jquery.min.js"></script>
    <script type="text/javascript" src="./script/doT.min.js"></script>
    <script type="text/javascript" src="./script/base.js"></script>
    <script type="text/javascript" src="./script/api.js"></script></head>
    <script type="text/javascript" src="./script/aui-tab.js" ></script>
    <script type="text/javascript" src="./script/jquery-3.2.0.js"></script>
</head>
<body>

    <header class="head" style="padding-top:0.4rem;">
        <div class="head-l" tapmode onclick="closeWin();"><i class="fa fa-angle-left"></i></div>
        <h3 id="title">快抖云  </h3>
        <div class="head-r" onclick="mine_kdy();">我的作品</div>
    </header>
    <div class="head-d" style="padding-top:0.4rem;"></div>

    <div class="kdy" id="list">
<!--         <img src="image/find-information-m-d.png" alt="">
        <dl>
            <dt>秋冬美白干货 | 黑白皮也能白成光的身体美白</dt>
            <dd>匿名用户<span>2019-03-14</span></dd>
        </dl>
        <div class="kdy-d">
            <p>
                <span><i class="fa fa-eye"></i>浏览量：56</span>
                <span><i class="fa fa-heart"></i>点赞：55</span>
            </p>
            <div class="kdy-btn">邀请码</div>
        </div> -->

    </div>
    <div class="find-school-add" tapmode onclick="find_details_video();">
        <img src="image/find-school-add.png">
    </div>


    <div class="body-bg"></div>

</body>
<script type="text/javascript" src="./script/api.js"></script>
<script type="text/javascript" src="./script/index.js"></script>

<script type="text/template" id="template_right">
    {{~it:value:index}}
    <img src="{{=value.photo}}" onclick="gotoVideo('{{=value.ext}}','{{=value.id}}','{{=value.photo}}');">
    <dl>
        <dt>{{=value.title}}</dt>
        <dd>{{=value.user_name}}<span>{{=value.created_at}}</span></dd>
    </dl>
    <div class="kdy-d">
        <p>
            <span><i class="fa fa-eye"></i>浏览量：{{=value.number_views}}</span>
            {{? value.is_like == 1}}
            <span id="is_point{{=value.id}}" class="active"><i class="fa fa-heart" onclick="point('{{=value.id}}');"></i>点赞：<b id="pointNum{{=value.id}}">{{=value.number_likes}}</b></span>
            {{??}}
            <span id="is_point{{=value.id}}"><i class="fa fa-heart" onclick="point('{{=value.id}}');"></i>点赞：<b id="pointNum{{=value.id}}">{{=value.number_likes}}</b></span>
            {{?}}
        </p>
        <div class="kdy-btn" onclick="invite_code('{{=value.user_code}}');">邀请码</div>
    </div>
    {{~}}

<!--     {{~it:value:index}}
    <div class="find-school" tapmode>
        <img src="{{=value.photo}}" onclick="gotoVideo('{{=value.ext}}','{{=value.id}}');">
        <div class="find-school-d">
            <dl>
                <dt>{{=value.title}}</dt>
                <dd>
                    <p><i>{{=value.user_name}}</i>{{=value.created_at}}</p>
                    <span>浏览量：{{=value.number_views}}</span>
                </dd>
            </dl>
            <div class="find-school-btn" onclick="invite_code('{{=value.user_code}}');">邀请码</div>
        </div>
    </div>
    {{~}} -->
    

</script>

<script type="text/javascript">

    apiready = function(){

        loadCollege();      

        pullLoading();
        pullRefresh();
        reloadListener(); 
    }

    // 加载快抖云数据
    function loadCollege(more){

            // 进度提示框
            // api.showProgress({
            //     title: '努力加载中...',
            //     text: '请稍等...',
            //     modal: false
            // });

            if (more) {
                page += 1;
            }else{
                page = 1;
            }

            var token = $api.getStorage('token');
            api.ajax({
                url: webAddress + '/api/education/index',
                method: 'get',
                data: {
                    values: {
                        page: page,
                        row: row,
                        category: 2,
                    },
                },
                headers: {
                    Authorization: 'Bearer ' + token,
                    Accept: 'application/json',
                },
            },function(ret, err){
                if (ret) {
                    // alert( JSON.stringify( ret ) );
                    // api.hideProgress();
                    // 关闭下拉刷新控件
                    api.refreshHeaderLoadDone();
                    if (more) {
                        templateFun(1,ret.data,2);
                    }else{
                        templateFun(0,ret.data,2);
                    }
                } else {
                    // alert( JSON.stringify( err ) );
                    if (err.body.message) {
                        api.toast({
                            msg: err.body.message,
                            duration: 2000,
                            location: 'bottom'
                        });
                        return false;
                    }
                }
            });
        }

    // 模板赋值函数(资料馆)
    function templateFun(more,data,type){
        if (!more && !data.length) {

            // 初次进入页面 无数据
            var list = $api.byId('list');
            var html = '<h2 style="padding:1rem; text-align:center; color:#999; font-size:0.5rem;">暂无内容</h2>';
            list.innerHTML = html;
        }else{


         if (type == 1) {
          var template = $api.byId('template_left');
      }else{


        var template = $api.byId('template_right');
    }
    var dotFn = doT.template(template.innerHTML);
    var html = dotFn(data);
    var list = $api.byId('list');

    if (more) {


        if (data.length) {


            $api.append(list, html);
        }else{


           api.toast({
              msg: '没有更多了',
              duration: 2000,
              location: 'bottom'
          });
           return false; 
       }
   }else{

       $api.html(list, html);
   }

}
}

    // 跳转网页
    function gotoWeb(webUrl,id){
        education_analysis(id);
        api.openWin({
            name: 'web_view',
            url: './web_view.html',
            pageParam: {
                url: webUrl,
                title: '快抖云',
            }
        });
    }

    // 播放快抖云视频
    function gotoVideo(webUrl,id,coverImg){
        education_analysis(id);
        // alert(webUrl);
        // api.openVideo({
        //     url: webUrl
        // });

        var moviePlayer = api.require('moviePlayer');
        moviePlayer.open({
          rect:{
              x: 0,
              y: 0,
              w:api.frameWidth,
              h:api.frameHeight
          },
          styles:{
              head:{
                  bg: 'rgba(0,0,0,0.5)',
                  height: 44,
                  y:20,
                  title:{
                      size:20,
                      color:'#fff',
                      width:40,
                      leftMargin:10
                  },
                  backSize: 38,
                  backImg:'widget://image/video_back.png',
                  customButtons:[{
                      w:30,
                      h:30,
                      rightMagin:10,
                      img:'widget://image/image/collect.png',
                      imgSelected:'fs://image/collectSelected.png',
                  }]},
                  foot:{  
                      bg: 'rgba(0,0,0,0.5)',
                      height: 44,
                      palyBtn:{
                          size: 20,
                          playImg:'widget://image/play.png',
                          pauseImg:'widget://image/pause.png',
                          marginLeft:15
                      },
                      currentTimeLabel:{
                          textSize:14,
                          textColor:"#FFF",
                          textWidth: 43,
                          marginLeft:5
                      },
                      seekBar:{
                          sliderImg:'widget://image/circle.png',
                          sliderW : 20,
                          sliderH : 20,
                          progressColor: '#696969',
                          progressSelected: '#76EE00',
                          marginLeft:10,
                          marginRight:10
                      },
                      totalTimeLabel:{
                          textSize:14,
                          textColor:"#FFF",
                          textWidth: 43,
                          marginRight:5
                      },
                      fullscreenBtn:{
                          size:0,
                          verticalImg:'widget://image/vertical.png',
                          horizontalImg:'widget://image/horizontal.png',
                      }
                  } },
                  path:webUrl,
                  autoPlay: true,
                  videoDirection: 'portrait',
                  autorotation: false,
              },function(ret, err){
                if(ret){

                    moviePlayer.addEventListener(function(ret){
                        if(ret && ret.eventType == 'back'){
                            moviePlayer.close();
                        }
                    });

                    // alert(JSON.stringify(ret));
                // } else {
                    // alert(JSON.stringify(err));
                }

            });
    }

    // 点赞
    function point(id) {
        var token = $api.getStorage('token');
        api.ajax({
            url: webAddress + '/api/education/'+id+'/like',
            method: 'post',
            data: {
                values: {
                },
            },
            headers: {
                Authorization: 'Bearer ' + token,
                Accept: 'application/json',
            },
        },function(ret, err){
            if (ret) {
                // alert( JSON.stringify( ret ) );
                if (ret.status_code == 200) {
                    api.toast({
                        msg: '操作成功',
                        duration: 2000,
                        location: 'bottom',
                    });
                    // loadCollege();
                    var hasActive = $('#is_point'+id).hasClass('active');
                    if (hasActive) {
                        // 获取当前点赞数
                        var pointNum = $('#pointNum'+id).text();
                        // 点赞数-1
                        $('#pointNum'+id).html(parseInt(pointNum) - 1);


                    }else{

                        var pointNum = $('#pointNum'+id).text();
                        // 点赞数+1
                        $('#pointNum'+id).html(parseInt(pointNum) + 1);
                    }
                    // 根据是否已赞 变化 active 状态
                    $('#is_point'+id).toggleClass('active');
                }

            } else {
                // alert( JSON.stringify( err ) );
                if (err.statusCode == 400) {
                    api.toast({
                        msg: err.body.message,
                        duration: 2000,
                        location: 'bottom'
                    });
                    return false;
                }
            }
        });
    }

    // 我的作品快抖云
    function mine_kdy(){
        api.openWin({
            name: 'kdy_mine',
            url: './kdy_mine.html',
            pageParam: {
                name: 'test'
            }
        });
    }

    // 统计
    function education_analysis(id){
        var token = $api.getStorage('token');
        api.ajax({
            url: webAddress + '/api/education/'+id+'/analysis',
            method: 'post',
            data: {
                values: {
                },
            },
            headers: {
                Authorization: 'Bearer ' + token,
                Accept: 'application/json',
            },
        },function(ret, err){
            if (ret) {
                // alert( JSON.stringify( ret ) );
                // if (ret.status_code == 200) {
                //     api.toast({
                //         msg: ret.message,
                //         duration: 2000,
                //         location: 'bottom'
                //     });
                // }

            } else {
                // alert( JSON.stringify( err ) );
                if (err.statusCode == 400) {
                    api.toast({
                        msg: err.body.message,
                        duration: 2000,
                        location: 'bottom'
                    });
                    return false;
                }
            }
        });
    }

    // 监听事件 (页面刷新)
    function reloadListener(){
        api.addEventListener({
            name: 'reload',
        }, function(ret, err){
            loadCollege();
        });
    }

    // 上拉加载
    function pullLoading(){
        api.addEventListener({
            name: 'scrolltobottom',
            extra: {
                threshold: 0
            }
        }, function(ret, err){
            loadCollege(1);
        });
    }

    // 下拉刷新
    function pullRefresh(){
        api.setRefreshHeaderInfo({
            // loadingImg: 'widget://image/refresh.png',
            bgColor: '#ccc',
            textColor: '#fff',
            textDown: '下拉刷新...',
            textUp: '松开刷新...'
        }, function(ret, err) {
            //在这里从服务器加载数据，加载完成后调用api.refreshHeaderLoadDone()方法恢复组件到默认状态
            loadCollege();
            
        });
    }

    function find_details_audio() {
        api.openWin({
            name: 'find_details_audio',
            url: './find_details_audio.html',
        });
    }

    // 发布新快抖云
    function find_details_video() {

        // 判断是否登录
        var token = $api.getStorage('token');
        if (!token) {
            api.confirm({
                title: '提示!',
                msg: '是否登录?',
                buttons: ['确定', '取消']
            }, function(ret, err){
                if( ret ){
                    // alert( JSON.stringify( ret ) );
                    if (ret.buttonIndex == 1) {
                        api.openWin({
                            name: 'login',
                            url: './login.html',
                        });

                    }
                }else{
                    // alert( JSON.stringify( err ) );
                }
            });
        }else{
            api.openWin({
                name: 'find_details_video',
                url: './find_details_video.html',
            });
        }
    }

    // 邀请码
    function invite_code(code){
      // alert(code);
      api.openWin({
        name: 'invite_code_kdy',
        url: './invite_code_kdy.html', 
        pageParam: {
          code: code
      }
  });
  }

  function index() {
    api.openWin({
        name: 'index',
        url: './index.html',
    });
}
function shop() {
    api.openWin({
        name: 'shop',
        url: './shop.html',
    });
}
function user_index() {
    api.openWin({
        name: 'user_index',
        url: './user_index.html',
    });
}
function closeWin(){
    api.closeWin({
    });
}
</script>
</html>